<template>
    <!-- 绑定支付宝页 -->
    <div class="forward">
        <div class="forward_area">
            <div class="forward_title_border"><span>当前{{current == 0?'魅力值':'余额'}}</span><span class="forward_number">{{charmInfo.money}}</span></div>
            <div class="forward_title" v-if="type==1"><span>转为钻石的{{current == 0?'魅力值':'余额'}}:</span></div>
            <div class="forward_title" v-if="type==2"><span>提现{{current == 0?'魅力值':'余额'}}（输入整{{current == 0?'万,1万=100人民币':'百'}}）:</span></div>
            <div class="charm_input">
                <input type="tel" v-model="charm_money_num" v-focus>
            </div>
            <div class="service_harge" v-if="type==2">手续费{{charmInfo.withdrawal_ratio || 0}}%</div>
            <div class="service_harge" >实际到账{{type==2?'金额：￥':'钻石：'}}{{getMoney}}</div>
            <div class="btn_account btne" style="margin-top:0;width: 5.88rem; margin-bottom: .4rem;" v-if="!charm_money_num">{{type==1?'转化':'提交'}}</div>
            <div class="btn_account" style="margin-top:0;width: 5.88rem; margin-bottom: .4rem;" v-if="charm_money_num" @click="checkPass">{{type==1?'转化':'提交'}}</div>
            <div class="forward_desc" v-if="type==2">
                <p>工作日12小时到账</p>
                <p>非工作日72小时到账</p>
            </div>
        </div>
        <!--输入支付密码-->
        <div class="get-importpaw" v-if="isShowpaw">
            <div class="importpaw-box">
                <div class="importpaw-box-top">
                    <h3 class="title"><span @click="showPawBox"></span>请输入支付密码</h3>
                    <!--密码框-->
                    <div class="setpaw-box">
                        <div class="paw-item">
                            <span>{{ this.pawStr1[0] | getpaw }}</span>            
                            <span>{{ this.pawStr1[1] | getpaw}}</span>            
                            <span>{{ this.pawStr1[2] | getpaw}}</span>            
                            <span>{{ this.pawStr1[3] | getpaw}}</span>            
                            <span>{{ this.pawStr1[4] | getpaw}}</span>            
                            <span style="border-right: none;">{{ this.pawStr1[5] | getpaw }}</span>            
                        </div>
                    </div>  
                    <p class="goforgetpaw">
                        <span style="color: #2abefc;" @click="forgetpaw">忘记密码</span>
                    </p>
                </div>  
                <!--键盘-->
                <div class="keyboard">
                    <div class="key-box">
                        <span class="spana" @click="getpaw(1,1)">1</span>
                        <span class="spana" @click="getpaw(2,1)">2</span>
                        <span @click="getpaw(3,1)" class="spana borderrn">3</span>
                    </div>
                    <div class="key-box">
                        <span class="spana" @click="getpaw(4,1)">4</span>
                        <span class="spana" @click="getpaw(5,1)">5</span>
                        <span @click="getpaw(6,1)" class="spana borderrn">6</span>
                    </div>
                    <div class="key-box">
                        <span class="spana" @click="getpaw(7,1)">7</span>
                        <span class="spana" @click="getpaw(8,1)">8</span>
                        <span @click="getpaw(9,1)" class="spana borderrn">9</span>
                    </div>
                    <div class="key-box">
                        <span class="over colore" style="font-size: .32rem;"></span>
                        <span class="spana" @click="getpaw(0,1)">0</span>
                        <span class="back colore spana" @click="cancelpaw(1)">×</span>
                    </div>
                </div>  
            </div>
            <div class="mask-layer" @click="showPawBox"></div>                          
        </div>
    </div>
</template>
<script>
    import { Toast } from 'mint-ui';
    export default{
        data:function(){
            return{
                charm_money_num:'',
                type:1,  //1：货币转换 2：提现
                password1:'',
                pawStr1:[],
                charmInfo:{},
                isShowpaw:false,
                isRequest:true,
                current:0, //当前是什么 0：魅力值 1：余额
                getMoney:0
            }
        },
        mounted:function(){
            this.isShowpaw = false;
            this.password1 = "";
            this.pawStr1 = [];
            this.type = this.getQueryString("type");
            this.current = this.getQueryString("current");
            if(this.current == 0){
                this.getAccountInfo("charm");
            }else{
                this.getAccountInfo("money");
            }
        },
        watch:{
            charm_money_num:function(newValue,oldValue){
                //手续费
                let getMoney;
                if(this.type == 2){ 
                    //魅力提现：100:1  余额提现：1:1
                    let money = newValue/(this.charmInfo.rate || 100);
                    let withdrawal = money*((this.charmInfo.withdrawal_ratio || 0)/100);
                    getMoney = (money-withdrawal).toFixed(2);
                }else{
                    let money;
                    if(this.current == 0){
                        //魅力转钻石：1:1
                        money = newValue*1;
                    }else{
                        //余额转钻石：1:100
                        money = newValue*100;
                    }
                    getMoney = money;
                }                
                this.getMoney = getMoney;
            }
        },
        methods:{
           //忘记密码
            forgetpaw(){
                this.$router.push({path:'/forgetpaw',query:{'type':this.type,'current':this.current,'money':'forget'}});
            },            
            getAccountInfo(currency){
                this.get({
                    url:"api/user/withdrawaldata?currency="+currency
                }).then(res=>{
                    this.charmInfo = res;
                })
            },
            //是否已经设置密码
            checkPass(){  
                let money = Number(this.charm_money_num);
                let currentMoney = Number(this.charmInfo.money);
                //console.log(money,currentMoney);
                if(this.type == 1){
                    if(money<=currentMoney){
                        this.basicinfo();
                    }else{
                        this.confirm(`当前${this.current==0?'魅力值':'余额'}不足！`);
                    }
                }else{
                    var charm_percent = this.current == 0?10000:100;
                    if(money%charm_percent == 0){          
                        if(money<=currentMoney){
                            this.basicinfo();
                        }else{
                            this.confirm(`当前${this.current==0?'魅力值':'余额'}不足！`);
                        }
                    }else{
                        this.confirm(`请输入整${this.current==0?'万':'百'}的${this.current==0?'魅力值':'余额'}！`);
                    }
                }
            },
            basicinfo(){
                this.get({
                    url:"api/user/basicinfo"
                }).then(res=>{
                    if(res.is_set_password == 1){
                        this.showPawBox();
                        //此处打开密码输入框 密码输入完成后调用下面的函数
                        //this.checkSubmit();
                    }else{
                        //去设置密码
                        this.$router.push({path:"/setpaypaw",query:{'money':this.charm_money_num,'currency':this.current == 0?'charm':'money','type':this.type}});
                        this.isShow = true;
                    }
                })
            },
            //检查密码输入
            checkSubmit(){
                this.post({
                    url:"api/check/password",
                    data:{
                        password:this.password1
                    }
                }).then(res=>{
                    //成功进行提现操作
                    this.showPawBox();  //关闭密码框
                    if(this.current == 0){
                        if(this.type == 1){
                            this.exchange('charm');
                        }else{
                            this.withdrawals("charm");
                        }
                    }else{
                        if(this.type == 1){
                            this.exchange('money');
                        }else{
                            this.withdrawals("money");
                        }
                    }
                }).catch(error=>{                   
                    this.password1 = "";
                    this.pawStr1 = [];
                })
            },
            withdrawals(currency){
                if(this.isRequest){
                    this.isRequest = false;
                    this.post({
                        url:"api/user/withdrawals",
                        data:{
                            charm_money_num:this.charm_money_num,
                            currency:currency
                        }
                    }).then(res=>{
                        //刷新魅力值
                        this.getAccountInfo(currency);
                        this.isRequest = true;
                        this.confirm("提现成功");
                        this.$router.push('/account');
                    }).catch(error=>{
                        this.isRequest = true;
                    })
                }
            },
            exchange(exchang_currency){
                if(this.isRequest){
                    this.isRequest = false;
                    this.post({
                        url:"api/currency/exchang",
                        data:{
                            exchang_currency:exchang_currency,
                            currency:'diamonds',
                            currency_number:this.charm_money_num,
                            currency_str:exchang_currency+'_to_diamonds'
                        }
                    }).then(res=>{
                        //刷新魅力值
                        this.getAccountInfo(exchang_currency);
                        this.isRequest = true;
                        this.confirm("兑换成功");
                        this.$router.push('/account');
                    }).catch(error=>{
                        this.isRequest = true;
                    })
                }
            },
            //点击获取密码值1
            getpaw(num,type){
                if(this.password1.length < 6 && type == 1){                
                    this.password1 += num.toString();  //第一次密码
                    this.getpawnum(type);
                    if(this.password1.length == 6){
                        this.checkSubmit();
                    }
                }else{
                    return;
                }
            },
            //后退取消密码
            cancelpaw(type){

                var len1 = this.password1.length - 1;

                if(this.password1.length != 0 && type == 1){
                    this.password1 = this.password1.substring(0,len1);
                }
                this.getpawnum(type);
            },
            //密码框获取密码
            getpawnum(type){
                if(type == 1){
                    this.pawStr1 = this.password1.split('');
                }
            },
            //是否显示密码框
            showPawBox(){
                this.password1 = "";
                this.pawStr1 = [];
                this.isShowpaw = !this.isShowpaw;
            }            
            
        },
        filters:{
            getpaw:function(num){
                if(num){
                    return '*'
                }
            }
        }        
    }
</script>
<style type="text/css">
    @import url('./account.css');
</style>